<template>
  <router-view />
</template>

<style>
button {
  margin: 1rem 12px;
  display: block;
}

.hero {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding-left: 24px;
  padding-right: 24px;
  padding-top: 3rem;
  padding-bottom: 3rem;
  height: 100vh;
}

.form-group {
  margin: 18px 24px;
  overflow: hidden;
}

.select-group {
  display: flex;
  justify-content: center;
  align-items: center;
}

.bg-dark {
  color: #ececec;
}

.bg-dark .form-select,
.bg-dark .form-input,
.bg-dark .modal-container {
  background-color: #3b4351 !important;
  color: #eee !important;
}

.modal-container .modal-header {
  color: #ccc;
}

.navbar {
  margin-bottom: 2rem;
}

.label {
  user-select: none;
}
</style>